<template>
  <el-dialog title="价格推送" :close-on-click-modal="false" :visible.sync="visible">
    <el-form
      :model="dataForm"
      :rules="dataRule"
      ref="dataForm"
      @keyup.enter.native="dataFormSubmit()"
      label-width="80px"
    >
      <el-form-item label="销售平台" prop="blonPlantform">
        <el-select
          v-model="dataForm.blonPlantform"
          clearable
          @change="pfChange"
          placeholder="请选择销售平台"
        >
          <el-option
            v-for="item in pfs"
            :key="item.id"
            :label="item.name"
            :value="item.id"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="店铺" prop="store">
        <el-select v-model="sendRs.storeId" clearable placeholder="请选择店铺">
          <el-option
            v-for="item in stores"
            :key="item.id"
            :label="item.name"
            :value="item.id"
          ></el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="店铺推送">
        <el-radio-group v-model="sendRs.sendType" size="mini">
          <el-radio border :label="0">0库存</el-radio>
          <el-radio border :label="1">正常</el-radio>
        </el-radio-group>
      </el-form-item>

      <el-form-item label="地区推送">
        <el-radio-group v-model="sendRs.sendType" size="mini">
          <el-radio border :label="2">0库存</el-radio>
          <el-radio border :label="3">正常</el-radio>
        </el-radio-group>
        <el-form-item>
          <el-select
            @change="proChange"
            v-if="sendRs.sendType == 2 || sendRs.sendType == 3"
            v-model="dataForm.province"
            clearable
            placeholder="请选择省份"
          >
            <el-option
              v-for="item in provinces"
              :key="item.cityCode"
              :label="item.cityNameZh"
              :value="item.cityCode"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-select
            v-if="sendRs.sendType == 2 || sendRs.sendType == 3"
            v-model="sendRs.sendId"
            clearable
            @change="cityChange"
            placeholder="请选择城市"
          >
            <el-option
              v-for="item in citys"
              :key="item.cityCode"
              :label="item.cityNameZh"
              :value="item.cityCode"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-select
            v-if="sendRs.sendType == 2 || sendRs.sendType == 3"
            v-model="sendRs.sendId"
            clearable
            placeholder="请选择区域"
          >
            <el-option
              v-for="item in countys"
              :key="item.cityCode"
              :label="item.cityNameZh"
              :value="item.cityCode"
            ></el-option>
          </el-select>
        </el-form-item>
      </el-form-item>

      <el-form-item label="分组推送">
        <el-radio-group @change="storeStateChange" v-model="sendRs.sendType" size="mini">
          <el-radio border :label="4">0库存</el-radio>
          <el-radio border :label="5">正常</el-radio>
        </el-radio-group>
        <el-form-item>
          <el-select
            v-if="sendRs.sendType == 4 || sendRs.sendType == 5"
            v-model="sendRs.sendId"
            clearable
            placeholder="请选择分组"
          >
            <el-option
              v-for="item in groups"
              :key="item.id"
              :label="item.groupName"
              :value="item.id"
            ></el-option>
          </el-select>
        </el-form-item>
      </el-form-item>
    </el-form>

    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="submit()">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
export default {
  data() {
    return {
      radio: "",
      visible: false,
      dataForm: {
        dtId: null,
        blonPlantform: null,
        store: null,
        province: null,
      },
      sendRs: {
        storeId: null,
        sendType: null,
        sendId: null,
      },
      tier: 1,
      parentId: -1,
      provinces: [],
      citys: [],
      countys: [],
      pfs: [],
      stores: [],
      groups: [],
      areas: [],
      dtList: [],
      dtListTreeProps: {
        label: "name",
        children: "children",
      },
      dataRule: {
        blonPlantform: [{ required: true, message: "请选择销售平台", trigger: "blur" }],
        store: [{ required: true, message: "请选择店铺", trigger: "blur" }],
      },
    };
  },
  methods: {
    // 获取机构及销售平台下拉列表数据
    getQuryPf() {
      this.$http({
        url: this.$http.adornUrl("/op/taskstatus/pf"),
        method: "get",
      }).then(({ data }) => {
        if (data && data.code === 0) {
          this.pfs = data.spfs;
          console.info(data);
        }
      });
    },
    // 查询店铺信息
    getStore() {
      this.$http({
        url: this.$http.adornUrl("/op/taskstatus/store"),
        method: "get",
        params: this.$http.adornParams({
          pf: this.dataForm.blonPlantform,
        }),
      }).then(({ data }) => {
        if (data && data.code === 0) {
          this.stores = data.list;
        }
      });
    },

    // 选择销售平台
    pfChange(value) {
      this.getStore();
    },
    //选择店铺
    storeStateChange(value) {
      this.getGroup();
    },
    // 查询分组信息
    getGroup() {
      this.$http({
        url: this.$http.adornUrl("/op/group/groupps"),
        method: "get",
        params: this.$http.adornParams({
          pf: this.dataForm.blonPlantform,
          storeId: this.sendRs.storeId,
        }),
      }).then(({ data }) => {
        if (data && data.code === 0) {
          this.groups = data.list;
          console.info(data.list);
        }
      });
    },
    // 获取区域查询条件
    getQuryCitys() {
      this.$http({
        url: this.$http.adornUrl("/op/dtuphtl/citys"),
        method: "post",
        params: this.$http.adornParams({
          tier: this.tier,
          parentId: this.parentId,
        }),
      }).then(({ data }) => {
        if (data && data.code === 0) {
          switch (this.tier) {
            case 1:
              this.provinces = data.list;
              break;
            case 2:
              this.citys = data.list;
              break;
            case 3:
              this.countys = data.list;
              break;
          }
          console.info(data.list);
        }
      });
    },

    // 选择省份
    proChange(value) {
      this.parentId = value;
      this.tier = 2;
      this.getQuryCitys();
    },
    // 选择城市
    cityChange(value) {
      this.parentId = value;
      this.tier = 3;
      this.getQuryCitys();
    },
    init() {
      this.visible = true;
      this.$nextTick(() => {
        this.$refs["dataForm"].resetFields();
        this.getQuryPf();
        this.getQuryCitys();
      });
    },
    // 提交
    submit() {
      this.$confirm(`确定操作?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.$http({
            url: this.$http.adornUrl("/op/rates/send"),
            method: "get",
            params: this.$http.adornParams({
              storeId: this.sendRs.storeId,
              sendType: this.sendRs.sendType,
              sendId: this.sendRs.sendId
            }),
          }).then(({ data }) => {
            if (data && data.code === 0) {
              console.info(data.list);
              this.sendRs.storeId=null;
              this.sendRs.sendType=null;
              this.sendRs.sendId=null;
              this.visible=false;
            }
          });
        })
        .catch(() => {
          console.log("取消操作");
        });
    },
  },
};
</script>
